import React, { Component } from 'react';
import {
  Card,
  Radio,
  Button,
  Table,
  Menu,
  Input,
  Divider,
  Popconfirm,
  Modal,
  message
} from 'antd';
import { connect } from 'dva';
import SupplierItem from './components/Supplier';
import config from '../../../config/web.config'
import styles from './index.less';
import { getValueWithLocalStorage, getOwner } from '@/utils/authority';
import defaultPic from '@/assets/default.png'

const namespace = 'Inventory';
const RadioButton = Radio.Button;
const RadioGroup = Radio.Group;

const mapStateToProps = state => {
  const list = state[namespace].recordLogs;
  const isLoading = state[namespace].recordLogsLoading;
  return {
    list,
    isLoading,
  };
};

const mapDispatchToProps = dispatch => {
  return {
    getList: (key) => {
      const action = {
        type: `${namespace}/queryRecordLogs`,
        payload: {
          key,
          owner: getOwner(),
        },
      };
      dispatch(action);
    },
  };
};

@connect(
  mapStateToProps,
  mapDispatchToProps
)
class ContactList extends Component {
  constructor(props) {
    super(props);
    this.state = {
      modalVisible: false,
      itemData: {},
      key: '0',
      modalLoading: false,
    };
    // this.formRef = React.createRef();
  }

  componentDidMount() {
    console.log("owwooooooooooooooooooooooooooooo");
    config.loadlCNZZ()
    this.reloadData();
  }

  reloadData = () => {
    this.props.getList(this.state.key);
  };

  render() {
    const columns = [
      {
        title: '图片',
        dataIndex: 'goods',
        key: 'picurl',
        width: 60,
        render: (goods, record) => {
          const text = goods ? goods.picurl : null;
          return <img
            className={styles.cell_headurl}
            src={ !text ? defaultPic : config.HttpUrl+'/file/pic/' + (text.indexOf('.png')== -1 ?text+'.png':text)}
          />
        },
      },
      {
        title: '配件',
        dataIndex: 'goods',
        key: 'name',
        width: 150,
        render: (goods, record) => {
          return (goods && goods.name) ? goods.name : '---'
        }
      },
      {
        title: '编码',
        dataIndex: 'goods',
        key: 'barcode',
        width: 150,
        render: (goods, record) => {
          return (goods && goods.barcode) ? goods.barcode : '---'
        }
      },
      {
        title: '操作',
        dataIndex: 'type',
        key: 'type',
        width: 150,
        render: (text) => {
          if(text === '1'){
            return '采购入库'
          } else if(text === '2'){
            return '开单出库'
          } else if(text === '3'){
            return '工单删除入库'
          } else if(text === '4'){
            return '退货出库'
          }
        }
      },
      {
        title: '数量',
        dataIndex: 'num',
        key: 'num',
        width: 150,
      },
      {
        title: '操作时间',
        dataIndex: 'time',
        key: 'time',
        width: 150,
      },
    ];

    const { modalVisible, modalLoading, owner, key } = this.state;
    const { isLoading, list } = this.props;

    const extraContent = (
      <div className={styles.extraContent}>
        <RadioGroup
          value={key}
          onChange={e => {
            this.setState({ key: e.target.value }, () => {
              this.reloadData();
            });
          }}
        >
          <RadioButton value="0">全部</RadioButton>
          <RadioButton value="1">采购入库</RadioButton>
          <RadioButton value="2">开单出库</RadioButton>
          <RadioButton value="3">工单删除入库</RadioButton>
          <RadioButton value="4">退货出库</RadioButton>
        </RadioGroup>
      </div>
    );

    return (
      <Card
        bordered={false}
        title={'出入库记录'}
        style={{ marginTop: 24 }}
        bodyStyle={{ padding: '1px 0px 0px 0px' }}
        extra={extraContent}
      >
        <Table
          columns={columns}
          loading={isLoading}
          dataSource={list}
          rowKey="_id"
          pagination={{
            total: list.length
          }}
          // pagination={false}
        />
      </Card>
    );
  }
}


export default ContactList